<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<title>HOME</title>
		<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">

		<!--标准mui.css-->
		<link rel="stylesheet" href="../css/mui.min.css">
		<!--App自定义的css-->
		<link rel="stylesheet" type="text/css" href="../css/app.css" />
		<script src="../script/mui.min.js" type="text/javascript" charset="utf-8"></script>

		<style type="text/css">
			.item .count {
				font-size: 14px;
			}
			.hastest {
				font-size: 16px;
			}
			.mui-table-view-cell.mui-active {
				background-color: #3E9FEC;
				color: #FFF;
			}
			.mui-table-view {
				background-color: #3E9FEC;
				color: #fff;
			}
			.mui-table-view-cell:after {
				background-color: rgba(255, 255, 255, 0);
				right: 15px;
			}
			.mui-table-view-chevron .mui-table-view-cell {
				background-color: #fff;
				color: #1d1d27;
				border-left: 4px solid #3E9FEC;
			}
			.mui-table-view-cell>a:not(.mui-btn) {
				line-height: 40px;
				border-radius: 5px;
				background-color: rgba(255, 255, 255, 0.2);
				margin: -5px -8px;
			}
		</style>

	</head>

	<body>
		<!--<div class="mui-content">-->
		<ul class="mui-table-view" id="list">
		</ul>
		<!--</div>-->
	</body>
	<script type="text/html" id="listTem">
		{{each}}
		<li class="mui-table-view-cell mui-collapse mui-active">
			<a id="coll">
				<p class="mui-ellipsis-2" style="color: #fff;font-size: 15px;">{{$value.title}}
					<span class="mui-pull-right" style="padding: 5px 5px;"><img src="../image/edit02.png" style="height: 30px;"/></span>
				</p>
			</a>

			<ul class="mui-table-view mui-table-view-chevron">
				{{if $value.notes}} {{each $value.notes as v i}}
				<li class="mui-table-view-cell">
					<a class="item" data-value="{{$value.id}} " onclick="openTeach({{v.id}})" tapmode>
						<span class="mui-ellipsis mui-pull-left " style="width: 90%; ">{{v.title}}</span> <span class="mui-pull-right mui-icon mui-icon-arrowright " style="padding-top: 5px; "></span>
					</a>
				</li>
				{{/each}}
				{{else}}
				<li class="mui-table-view-cell ">
						<p class="mui-text-center " style="margin-left: -15px; ">该章节下暂无讲义哦!</p>
				</li>
				{{/if}}
			</ul>
			
		</li>
		{{/each}}
	</script>
	<script src="../script/app.js " type="text/javascript " charset="utf-8 "></script>
	<script src="../script/template.js " type="text/javascript " charset="utf-8 "></script>
	<script type="text/javascript ">
		function openTeach(id) {
			var data = {
				id:id,
			};
			api.openWin({
				name: 'notes',
				url: 'notes.html',
				pageParam:data
			});
		}

		function success(ret) {
			var html = template('listTem', ret.data);
			document.getElementById("list").innerHTML = html;
			document.getElementById("coll").click();
		}
		apiready = function() {
			var cid = localStorage.getItem('cid');
			if(!cid){
				cid = 3;
			}
			var url = MYAPP.webroot + "/api/index.php/Home/Index/getTeachList/cid/"+cid;
			api.ajax({
				url: url,
				method: 'get',
				timeout: 30,
				dataType: 'json',
				returnAll: false
			}, function(ret, err) {
				if (ret) {
					success(ret);
				} else {
					api.toast({
						msg: '错误码：' + err.code + '；错误信息：' + err.msg + '网络状态码：' + err.statusCode,
						location: 'middle',
						duration: 1000
					});
				}
			});
		}
	</script>

</html>